By

Contents
  1. 1. Browser measured latency
  2. 2. Server measured latency

There are two angles to measure a web page’s performace data, one model is from browser’s perspective, and the other is from server’s perspective.

Browser measured latency

For browser measured latencies, its overall diagram of web request is like below:

W3C PLT model

The timestamp used in Client side is implemented by pseudo-code like below

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<head>
st = new Date() /* baseline timestamp */
</head>
<body onload="onPageLoad()">
bst = new Date()
// Render html Page
bed = new Date()
 
function onPageLoad()
{
plst = new Date()
// execute script
pled = new Date()
}

</body>

Browser side latency

Server measured latency

About instrumentation, the timestamp used in Server side could use a long type to store.
Below is an example of a web service based on chunked transfer encode (2 chunks to render).

Server side latency

Contents
  1. 1. Browser measured latency
  2. 2. Server measured latency